import React, { useEffect } from "react";
import "./Login.model.css";
import { Button, Checkbox, Form, Input, message } from "antd";
import http from "../../utils/http";
import axios from "axios";
import cookie from "js-cookie";
import { useNavigate } from "react-router-dom";
import { useDispatch } from "react-redux";
import store from "store";
function Login() {
  const navtor = useNavigate();
  const dispatch = useDispatch();
  const [form] = Form.useForm();
  useEffect(() => {
    let users = store.get("users");
    if (users) {
      form.setFieldsValue(users);
    }
    sessionStorage.removeItem("pathKey");
    sessionStorage.removeItem("path");
  }, []);
  const onFinish = (values) => {
    console.log(values);

    http
      .post("/api/user/login", values)
      .then((res) => {
        console.log(res);
        if (res.code == 200) {
          sessionStorage.setItem("token", res.token);
          cookie.set("token", res.token, { expires: 7 });
          // if (values.remember) {
          //   store.set("users", values);
          // } else {
          //   store.remove("users");
          // }
          navtor("/admin/dataan/");
        } else {
          message.success(res.msg);
        }
      })
      .catch((err) => {});
  };

  const onFinishFailed = (errorInfo) => {
    console.log("Failed:", errorInfo);
  };
  return (
    <div className="login_app">
      
      <div className="Login_Div">
        <div className="Login_Left">
          <div className="Logo_div">
            <img src={require("../../assets/Image/logo2.png")} alt="" />
          </div>
          <p style={{ fontWeight: "bold" }}>
            百奥华兴为您提供领先的基因大数据解决方案
          </p>
          <img
            src={require("../../assets/Image/login.jpg")}
            width={60 + "%"}
            alt=""
          />
          <p className="version_p">版本号1.1</p>
        </div>
        <div className="Login_Right">
          <h3>BioHX项目管理系统</h3>
          <Form
            name="basic"
            style={{
              width: "50%",
            }}
            form={form}
            onFinish={onFinish}
            onFinishFailed={onFinishFailed}
            autoComplete="off"
          >
            <Form.Item
              name="username"
              rules={[
                {
                  required: true,
                  message: "账号不能为空!",
                },
              ]}
            >
              <Input placeholder="请输入账号" />
            </Form.Item>

            <Form.Item
              name="password"
              rules={[
                {
                  required: true,
                  message: "密码不能为空!",
                },
              ]}
            >
              <Input.Password placeholder="请输入密码" />
            </Form.Item>
            {/* <Form.Item name="remember" valuePropName="checked">
              <Checkbox
                checked={
                  store.get("users")
                    ? JSON.parse(store.get("users").remember)
                    : false
                }
              >
                记住密码
              </Checkbox>
            </Form.Item> */}
            <Form.Item>
              <Button className="Button" type="primary" htmlType="submit">
                立即登录
              </Button>
            </Form.Item>
          
          </Form>
        </div>
      </div>
    </div>
  );
}

export default Login;
// 记住密码
